<template>
  <div class="pageContent">
    <div style="padding: 2px 0; margin: 28px 0 28px 0">
      <div style="font-weight: bold; font-size: 20px">采购需求</div>
    </div>
    <!-- 搜索栏 -->
    <search @search="search" />
    <!-- 列表 -->
    <temlist style="margin: 2vw 0" :data="data" :loading="loading" />
    <!-- 分页器 -->
    <el-pagination
      class="pagination"
      layout="slot,prev, pager, next"
      :total="pag.total"
      :current-page="pag.pageNo"
      :page-size="pag.pageSize"
      @current-change="handleCurrentChange"
    >
      <template slot="default">
        <div>
          <span>总共{{ pag.total }}条</span>
        </div>
      </template>
    </el-pagination>
  </div>
</template>
<script>
/* 搜索 */
import search from "./module/search";
import temlist from "./module/temlist.vue";
export default {
  components: {
    search,
    temlist,
  },
  data() {
    return {
      searchs: {}, //搜索对象
      data: [], //数据集
      pag: {
        pageNo: 1,
        pageSize: 5,
        total: 0,
      },
      loading: false, //加载
    };
  },
  created() {
    this.getlist({ pageSize: 5, pageNo: 1 });
  },
  methods: {
    search(e) {
      this.searchs = e;
      let obj = {
        pageNo: 1,
        pageSize: 5,
      };
      obj = Object.assign(obj, e);
      this.getlist(obj);
    },
    getlist(e) {
      this.loading = true;
      this.$http.get("/getPurchaseList", { params: e }).then((res) => {
        if (res.code == 200) {
          this.data = res.data.data;
          this.pag.total = res.data.total;
          this.loading = false;
        }
      });
    },
    /* 分页 */
    handleCurrentChange(e) {
      this.pag.pageNo = e;
      let obj = {
        pageNo: this.pag.pageNo,
        pageSize: this.pag.pageSize,
      };
      obj = Object.assign(obj, this.searchs);
      this.getlist(obj);
    },
  },
};
</script>
<style scoped>
@import url("../../styles/pages.scss");
</style>